<%@ page contentType="text/html;charset=UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib prefix="fnc" uri="/WEB-INF/tlds/fnc.tld"%>
<%@ taglib prefix="shiro" uri="/WEB-INF/tlds/shiros.tld"%><!-- http://shiro.apache.org/tags -->
<%@ page isELIgnored="false"%>
<c:set var="basepath" value="${pageContext.request.contextPath}" />
<c:set var="path" value="${pageContext.request.contextPath}/other" />
<!DOCTYPE html>
<html>
<head>
    <title>查看</title>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

    <script src="${basepath}/assets/plugins/jquery-1.11.1.min.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="${basepath}/assets/easyui/themes/metro-blue/easyui.css">
    <link rel="stylesheet" type="text/css" href="${basepath}/assets/easyui/themes/icon.css">
    <script type="text/javascript" src="${basepath}/assets/easyui/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="${basepath}/assets/easyui/easyui-lang-zh_CN.js"></script>

    <link rel="stylesheet" type="text/css" href="${basepath}/assets/easyui/themes/mobile.css" />
    <link rel="stylesheet" type="text/css" href="${basepath}/assets/fullpage/jquery.fullPage.css" />
    <script src="${basepath}/assets/jqueryui/jquery-ui.min.js"></script>
    <script type="text/javascript" src="${basepath}/assets/easyui/jquery.easyui.mobile.js"></script>
    <script type="text/javascript" src="${basepath}/assets/fullpage/scrolloverflow.min.js"></script>
    <script type="text/javascript" src="${basepath}/assets/fullpage/jquery.fullPage.min.js"></script>
    <style>
        body{
            padding: 20px;
        }
        .section{
        <c:if test="${not empty background}">
            background: url("${background}");
        </c:if>
        }
    </style>
    <script type="text/javascript">
        $(document).ready(function() {
            $('#fullpage').fullpage({ slidesNavigation : true});
            <c:forEach items="${dataList}" varStatus="status" var="tplList">
                var dataJson${status.index} = eval('${tplList.userGridColumn}');
                var userDataJson${status.index}=eval('${tplList.userGridData}');
                var field${status.index}=new Array();
                var dataSet${status.index}=new Array();
                field${status.index}.push({'field':'行名','title':'行名'});
                //生成field
                $(dataJson${status.index}).each(function(index,element) {
                    if(element.itemType==1){
                        var fieldItem={'field':element.columnCode,'title':element.name};
                        field${status.index}.push(fieldItem);
                    }else{
                        var dataItem={'行名':element.name};
                        if(userDataJson${status.index}!=null){
                            $(userDataJson${status.index}).each(function(index2,element2) {
                                if(element2.行名==element.name){
                                    dataItem=element2;
                                }
                            })
                        }
                        dataSet${status.index}.push(dataItem);
                    }
                })
                datagrid${status.index} = $('#baseType${status.index}').datagrid({
                    rownumbers:true,
                    singleSelect:true,
                    header:'#hh${status.index}',
                    //pagination:true,
                    fit: true, //datagrid自适应宽度
                    fitColumn: true, //列自适应宽度
                    striped: true, //行背景交换
                    nowap: false, //列内容多时自动折至第二行
                    border: false,
                    idField: 'id', //主键
//                     width:350,
//                    height:'98%',
                    data:dataSet${status.index},
                    columns: [field${status.index}]
                })
                <%--datagrid${status.index}.datagrid("reload");--%>
            </c:forEach>
//            $('.datagrid-cell').css('font-size','24px');
        });
    </script>
</head>
<body>
    <div id="fullpage">
        <div class="section">
        <c:forEach items="${mList}" varStatus="status" var="tplList">
            <div class="slide">
                <div style="top:1px;width:99%">
                        ${tplList.content}
                </div>
            </div>
        </c:forEach>
        <c:forEach items="${dataList}" varStatus="status" var="tplList">
            <div class="slide">
                <div id="hh${status.index}">
                    <div class="m-toolbar">
                        <div class="m-title">${ status.index + 1}-${tplList.userName}</div>
                    </div>
                </div>
                <div style="top:0px;width:100%;height: 100%">
                    <table style="width:100%;height: 100%">
                        <tr>
                            <td style="padding-left: 0px;">
                                <table id="baseType${status.index}" class="easyui-datagrid"
                                       singleSelect="true" iconCls="icon-save">
                                </table>
                            </td>
                        </tr>
                    </table>
                </div>
            </div>
        </c:forEach>
        </div>
    </div>
</body>
<script>
</script>
</html>
